<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>比赛成绩列表</title>
    <script src="../../res/js/jquery-3.4.1.min.js"></script>
    <script src="../../res/layui/layui.js"></script>
    <script src="../../res/js/Tools.js"></script>
    <link rel="stylesheet" href="../../res/layui/css/layui.css">
    <script src="../../js/login_common.js"></script>

</head>
<body>



<table id="demo" lay-filter="test"></table>

<script>
    var table2 = null;
    var form = null;
    layui.use(['table','form'], function() {
        var table = layui.table;

        form = layui.form;

        var url = getRootPath() + "AtsEmpAthleteResultsController/selectAll";

        if(window.loginObj.user.companyNum=="2"){
            coachId = window.loginObj.user.filId;
            url+='?coachId='+coachId;
        }

        findSelect();

        //第一个实例
        table2 = table.render({
            elem : '#demo',
            height : 550,
            toolbar : '#toolbarDemo',
            url : url //数据接口
            ,
            page : true //开启分页
            ,
            cols : [ [ //表头
                {
                    type : 'checkbox',
                    fixed : 'left'
                }, {
                    field : 'athleteName',
                    title : '运动员名称',
                    width : 150
                }, {
                    field : 'matchName',
                    title : '比赛名称',
                    width : 200
                }, {
                    field : 'matchItem',
                    title : '比赛项目',
                    width : 200
                },{
                    field : 'matchResult',
                    title : '比赛成绩',
                    width : 200
                }, {
                    field : 'action',
                    title : '操作',
                    width : 200,
                    toolbar : "#barDemo"
                } ] ]
        });

        //监听工具条
        table.on('tool(test)', function(obj) {

            var data = obj.data;
            if (obj.event === 'detail') {
                layer.msg('ID：' + data.id + ' 的查看操作');
            } else if (obj.event === 'del') {
                layer.confirm('真的删除行么', function(index) {
                    //删除数据在这里可以使用Ajax异步  就和平常使用一样简单
                    $.post(getRootPath() + "AtsEmpAthleteResultsController/delete", {
                        id : data.resultId
                    }, function(ret) {
                        if (ret.num == 1) {
                            layer.msg(ret.msg, {
                                icon : 1,
                                time : 1500
                            }, function() {
                                newLoad();
                                //obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            });
                        } else {
                            layer.msg(ret.msg, {
                                icon : 2,
                                time : 1500
                            });
                        }
                    }, "json");
                });
            } else if (obj.event === 'edit') {
                layer.open({
                    type : 2,
                    title : '比赛成绩编辑',
                    shadeClose : true,
                    shade : 0.8,
                    area : [ '700px', '90%' ],
                    content : 'atsEmpAthleteResults.html?id=' + data.resultId, //iframe的url
                    end : function() {
                    }
                });
            } else if (obj.event === 'select') {
                layer.open({
                    type : 2,
                    title : '比赛成绩查看',
                    shadeClose : true,
                    shade : 0.8,
                    area : [ '700px', '40%' ],
                    content : 'atsEmpAthleteResults.html?select=1&id=' + data.resultId, //iframe的url
                    end : function() {
                    }
                });
            }
        });

        $("#close").click(function() {
            $("#divImg").hide(2000);
        });

        //头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'deleteAllBut':
                    layer.confirm('您真的要删除吗', function(index) {
                        var data = checkStatus.data;
                        var ids = "";
                        $.each(data, function(index, item) {
                            ids += item.resultId + ",";
                        });

                        var url = getRootPath() + "AtsEmpAthleteResultsController/deleteAll";
                        var datas = {
                            ids : ids
                        };
                        $.post(url, datas, function(obj) {
                            layer.msg(obj.msg);
                            if(obj.num==1) {
                                newLoad();//刷新表格
                            }
                        }, "json");
                    });
                    break;
                case 'addBut':
                    layer.open({
                        type : 2,
                        title : '比赛成绩编辑',
                        shadeClose : true,
                        shade : 0.8,
                        area : [ '700px', '90%' ],
                        content : 'atsEmpAthleteResults.html', //iframe的url
                        end : function() {
                        }
                    });
                    break;
                case 'seachTable':
                    var coachId = null;
                    if(window.loginObj.user.companyNum=="2"){
                        coachId = window.loginObj.user.filId;
                    }

                    var co = $("#athleteId").val();
                    var ma = $("#matchName").val();

                    table2.reload({
                        url: getRootPath() + 'AtsEmpAthleteResultsController/selectAll',
                        where: {
                            athleteId: $("#athleteId").val(),
                            matchName: $("#matchName").val(),
                            coachId:coachId
                        },
                        page: { curr: 1 }
                    });

                    findSelect(co);

                    $("#matchName").val(ma);

            }
        });
    });

    /**
     * 用在新增或者修改界面   由子窗口调用
     */
    function newLoad() {

        var co = $("#athleteId").val();
        var ma = $("#matchName").val();

        layui.table.reload("demo");

        if(window.loginObj.user.companyNum=="2"){
            $("#coachdiv").css("display","none");
            $("#sportdiv").css("display","none");
        }

        findSelect(co);
        $("#matchName").val(ma);
    };

    function findSelect(athleteId) {
        var url = getRootPath() + "AtsEmpAthleteController/findAll";
        var data = "";

        if(window.loginObj.user.companyNum=="2"){
            coachId = window.loginObj.user.filId;
            data={'coachId':coachId};
        }

        $.post(url,data,function (obj) {
            $.each(obj,function (i,item) {
                $("#athleteId").append("<option value='"+item.athleteId+"'>"+item.athleteName+"</option>");
            });
            $("#athleteId").val(athleteId);
            form.render();
        },"json");
    }
</script>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="select">查看</a>
</script>

<script type="text/html" id="toolbarDemo">
    <div>


        <div class="layui-inline">
            <input class="layui-input" name="matchName" id="matchName"
                   autocomplete="off" placeholder="比赛名称">
        </div>

        <div class="layui-inline">
            <select name="athleteId" id="athleteId" lay-verify="required" lay-search="">
                <option value="">直接选择或搜索选择运动员</option>
            </select>
        </div>

        <button class="layui-btn layui-btn-sm"  lay-event="seachTable">搜索</button>
        <button class="layui-btn layui-btn-sm" lay-event="deleteAllBut">删除选中数据</button>
        <button class="layui-btn layui-btn-sm"  lay-event="addBut">增加数据</button>
    </div>
</script>
</body>
</html>